<extend name="Base/common"/>



<block name="head"></block>

<block name="body">

    <script src="http://libs.useso.com/js/jquery/2.1.1/jquery.min.js" type="text/javascript"></script>

    <script type="text/javascript">

        $(".navbar-nav li").eq(3).addClass("active");

    </script>

    <script type="text/javascript">

        var priceAjax='{:U("Home/Index/priceAjax",'','')}';        

    </script>

     <div class="booking_title">
           <h1><img src="__PUBLIC__/Index/images/book_titlebg.jpg">{$tinstru['title']}</h1>
     </div>

        <div class="teach_page" style="background: url(__ROOT__{$tinstru['pic']|get_cover=path}) ">

            {$tinstru['detail']} 

        </div>
 <div class="booking_title"><h1>{$CateGoryList['title']}</h1></div>
    <div class="container">

       

                 <div class="teach_page">{$CateGoryList['detail']}</div>

        <volist name="courses" id="data">

            <div class="booking_title2">{$data['title']}</div>

            <div class="id" style="display:none;">{$data['id']}</div>

            <div class="row">

                <div class="col-md-7 table_content">

                    <table class="table table-border-blue">

                        <thead>

                         <tr>

                            <notempty name='data.address.0'><th>上課地點</th></notempty>

                            <notempty name='data.num.0'><th>班級人數</th></notempty>

                            <notempty name='data.grade.0'><th>級別</th></notempty>

                            <notempty name='data.time'><th>時間</th></notempty>

                            <notempty name='data.Hallnum.0'> <th>堂數</th></notempty>

                        </tr>

                        </thead>

                        <tbody>

                            <tr>

                        <notempty name='data.address.0'>

                            <td>

                                <select multiple class="form-control table_rowtd" id="adress">

                                    <if condition ="is_array($data['address'])">

                                        <volist name="data.address" id="vo">

                                            <option>{$vo}</option>

                                        </volist>

                                        <else/>

                                        <option>{$data['address']}</option>

                                    </if>

                                </select>

                            </td>

                        </notempty>

                        <notempty name='data.num.0'>

                            <td>

                                <select multiple class="form-control table_rowtd" id="number">

                                    <if condition ="is_array($data['num'])">

                                        <volist name="data['num']" id="vo">

                                            <option>{$vo}</option>

                                        </volist>

                                        <else/>

                                        <option>{$data['num']}</option>

                                    </if>

                                </select>

                            </td>

                        </notempty>

                        <notempty name='data.grade.0'> 

                            <td>

                                <select multiple class="form-control table_rowtd" id="level">

                                    <if condition ="is_array($data['grade'])">

                                        <volist name="data['grade']" id="vo">

                                            <option>{$vo}</option> 

                                        </volist>

                                        <else/>

                                        <option>{$data['grade']}</option>

                                    </if>

                                </select>

                            </td>

                        </notempty>

                        <notempty name='data.time'>

                            <td>

                                <select multiple class="form-control table_rowtd" id="time">

                                    <if condition ="is_array($data['time'])">

                                        <volist name="data['time']" id="vo">

                                            <option>{$vo}</option>

                                        </volist>

                                        <else/>

                                        <option>{$data['time']}</option>

                                    </if>

                                </select>

                            </td>

                        </notempty>

                        <notempty name='data.Hallnum.0'>

                            <td>

                                <select multiple class="form-control table_rowtd" id="class">

                                    <if condition ="is_array($data['Hallnum'])">

                                        <volist name="data['Hallnum']" id="vo">

                                            <option>{$vo}</option>

                                        </volist>

                                        <else/>

                                        <option>{$data['Hallnum']}</option>

                                    </if>

                                </select>

                            </td>

                        </notempty>

                        </tr>

                        </tbody>

                    </table>

                    <b>*{$data['note']}</b>

                    <div class=" text-right price"><span>价格(MOP)：</span><span class="price_num"></span></div>

                </div>

                <br>

                <div class="col-md-5 text-center">

                    <button class="btn btn-large bk-btn_blue" data-toggle="modal" data-target="#myModal_bk">我要預約</button>

                    <div class="shar">
                        <a href="javascript:;" title="facebook分享" class="al_fb"><i class="fa fa-facebook-square"></i></a>
                        <a href="javascript:;" title="webchat分享" class="jiathis_button_weixin"><i class="fa fa-comments"></i></a>
                    </div>

                </div>

            </div>

        </volist>

    </div>



    <!--modal-->

    <div class="modal fade" id="myModal_bk" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">

        <div class="modal-dialog">

            <div class="modal-content">

                <div class="modal-header">

                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>

                    <h4 class="modal-title text-center" id="myModalLabel">課程預約</h4>

                </div>

                <form id="form1" method="post" action="{:U('Home/Index/appointment','','')}">

                    <div class="modal-body">

                        <dl class="dl-horizontal">

                            <dt>预约课程：</dt>

                            <dd><input type="text" class="course_val input_val" value="" name="course"  /></dd>

                            <dt>上課地點：</dt>

                            <dd><input type="text" class="adress_val input_val" value="" name="address" /></dd>

                            <dt>班級人數：</dt>

                            <dd><input type="text" class="number_val input_val" value="" name="number"/></dd>

                            <dt>級別：</dt>

                            <dd><input type="text" class="level_val input_val" name="level"  value="" ></dd>

                            <dt>堂數：</dt>

                            <dd><input type="text" class="class_val input_val" name="class" value="" /></dd>

                            <dt>時間：</dt>

                            <dd><input type="text" class="time_val input_val" name="time" value="" /></dd>

                            <dt>價格：</dt>

                            <dd><input type="text" class="book_val input_val" name="price" value="" /></dd>

                        </dl>                

                    </div>



                    <div class="modal-body">

                        <p><input type="text" class="form-control" id="username" placeholder="姓名：" value="{:session('menber_auth.ccount')}" name="name"></p>

                             <p><input type="text" class="form-control" id="mobile" value="{:session('menber_auth.tel')}" placeholder="手機：" name="mobile"></p>

                    <p><input type="text" class="form-control" id="mobile" value="{:session('menber_auth.email')}" placeholder="郵箱：" name="email"></p> 

                        <p><input type="text" class="form-control" id="age" value="{:session('menber_auth.age')}" placeholder="年龄：" name="age"></p> 

                       

                    </div>



                    <div class="modal-footer">

                        <a class="btn btn-blue" id="btnsubinstru" style="width: 90%">立即提交</a>

                    </div>

                </form> 

            </div>

        </div>

    </div>
<script src="http://v3.jiathis.com/code/jia.js" type="text/javascript" charset="utf-8"></script>

<script>
  window.fbAsyncInit = function() {
    FB.init({
      appId      : '1638553949767051',
      xfbml      : true,
      version    : 'v2.4'
    });
  };

  (function(d, s, id){
     var js, fjs = d.getElementsByTagName(s)[0];
     if (d.getElementById(id)) {return;}
     js = d.createElement(s); js.id = id;
     js.src = "//connect.facebook.net/en_US/sdk.js";
     fjs.parentNode.insertBefore(js, fjs);
   }(document, 'script', 'facebook-jssdk'));

$(".al_fb").click(function () {
                var data = {
                    method: 'feed',
                    name: $(".booking_title").find("h1").eq(1).text(),
                    description: $(".teach_page").eq(1).find("p").text(),
                    link: window.location.href,
                    // picture: ("http://www.lovemusic.center/" + $('.news_con').find('img').attr('src')),
                    actions: [
                        {name: 'lovemusic', link: 'http://www.lovemusic.center'}
                    ]
                };
                FB.ui(data, function (response) {
                });
                return false;
            });

</script>
    <block name="footer"></block>           

</block>